<template>
  <div class="global-box" >
    <a-form-model ref="ruleForm" :model="form" :rules="rules" @submit="onSubmit" @submit.native.prevent>
      <d-form-item :rules="rules" :datas="fieldArr1" :form="form">
        <template slot="title"></template>
      </d-form-item>
    </a-form-model>
    <div class="img" style="position:absolute;top:0;right: 0;width: 150px;height:197px;background-color: white;overflow: hidden">
      <j-image-upload class="avatar-uploader" text="上传照片" v-model="form.imgUrl" :disabled="false" />
    </div>
    <div>
      <a-modal v-model="visible" title="详细信息" @ok="handleOk" width="600px" centered>
        <Input ref="inpute" @inputse="inputse"></Input>
      </a-modal>
    </div>
  </div>
</template>

<script>
// import * as caseApi from '@/api/modules/case.js'
import dFormItem from "@/views/xlgc/lawCase/contradiction/detailed/dFormItem";
import {updatas} from '@/api/xlgc/lawCase'
import Input from '@/views/xlgc/lawCase/LifeCase/detailed/ImportModal'
export default {
  inject:['closeCurrent'],
  components:{
    dFormItem,
    Input
  },
  props:{
    suspects:Number
  },
  data() {
    return {
      visible:false,
      id: null,
      fieldArr1: [
        {label: '姓名', prop: 'name', tagType: 'input',},
        {label: '性别', prop: 'sex',
          tagType: 'radio-group', dictCode:'sex',
           arr:[{key:'男',val:1},{key:'女',val:2}],},
        {label: '民族', prop: 'nation', tagType: 'dict-select',dictCode:'nation',span: 2, style:"width: 50%;margin-right: 150px;"},
        { label: '出生日期', prop: 'birthday', tagType: 'date-picker' },

        {label: '学历', prop: 'education', tagType: 'dict-select',dictCode:'education' },
        {label: '人员类别', prop: 'personnelCategory', tagType: 'selects',dictCode:'personnel_category', span: 2, style:'width: 50%;margin-right: 150px;'},


        {label: '证件代码', prop: 'documentType', tagType: 'dict-select',dictCode:'document_type'},
        {label: '证件号码', prop: 'identificationNumber', tagType: 'input',span:3,style:"width: 70%;float: left"},
        {label: '居住详址', prop: 'detailedResidentialAddress', tagType: 'input', dictCode:'state_of_the_case', span: 3,style:'width: 70%;'},
      ],
      form: {
        photo:'',
        personnelCategory: undefined
      },
      rules: {
        name:[{ required: true, message: '请输入姓名', trigger: 'change' },],
        sex: [
          { required: true, message: '请选择性别', trigger: 'change' },
        ],
        nation:[
          { required: true, message: '请输入', trigger: 'change' },
        ],
        birthday: [
          { required: true, message: '请输入', trigger: 'change' },
        ],

        documentType: [
          { required: true, message: '请输入', trigger: 'change' }
        ],

        identificationNumber: [
          { required: true, message: '请输入', trigger: 'change' },
          { min:16,max: 18, message: '身份证格式错误', trigger: 'change' },
          {pattern:/^[1-9][0-9]{5}(19|20)[0-9]{2}((01|03|05|07|08|10|12)(0[1-9]|[1-2][0-9]|30|31)|(04|06|09|11)(0[1-9]|[1-2][0-9]|30)|02(0[1-9]|[1-2][0-9]))[0-9]{3}([0-9]|x|X)$/,message: '请输入正确的身份证号码',}

        ],
        personnelCategory:[
          { required: true, message: '请输入', trigger: 'change' },
        ],
        detailedResidentialAddress:[
          { required: true, message: '请输入', trigger: 'change' },
        ]

      }
    }
  },
  created() {
    if(this.$route.query.id) {
      this.id = this.$route.query.id
    }
  },
  methods: {
    setControl(obj){
      this.form = obj
      console.log(this.form)
      if(this.form.sex){
        this.form.sex = this.form.sex === '男' ? 0 : 1
      }

    },
    inputse(val){
      this.form.imgUrl = val
    },
    handleOk() {
      this.$refs.inpute.handleOk()
    },
    updatase(){
      this.visible = true
    },
    onSubmit() {
      this.$refs.ruleForm.validate((valid) => {
        if (valid) {
          caseApi.caseEdit(this.form).then((res) => {
            if (res.success) {
              this.$message.success(res.message);
              this.onCancle()
            } else {
              this.$message.warn(res.message);
            }
          }).catch(e=>{
            this.$message.warn("请求失败！");
          })
        } else {
          return false
        }
      })
    },
    // 刑拘起止时间
    blurRangePicker(dates) {
      this.$set( this.form, 'startTimeDetention', dates[0] )
      this.$set( this.form, 'stopTimeDetention', dates[1] )
    },
    resetForm() {
      this.$refs.ruleForm.resetFields()
    },
    onCancle() {
      // 注意：以下代码必须存在
      // inject:['closeCurrent'],
      this.closeCurrent()
      this.$router.push({ path: "/case" })
    },
    submitForm() {
      this.$refs.ruleForm.validate(valid => {
        console.log(valid)
        // this.passCheck = valid
        this.$emit('passCheck',valid)
      });
    },
  },
  watch:{
    form:{
      deep:true,
      handler(a,b){
        console.log(this.form)
        this.$emit('basicses1',this.form)
      }
    },
  }
}
</script>
<style lang="less" scoped>
//.global-box {
//  background-color: #fff;
//  .global-box-title {
//    font-size: 18px;
//    color: #000;
//    border-bottom: 1px #e8e8e8 solid;
//    padding: 10px 24px;
//  }
//  /deep/.ant-descriptions {
//    padding: 24px 24px 0 24px;
//  }
//  /deep/.padding_class {
//    // padding: 8px;
//    padding-top: 6px;
//    padding-bottom: 6px;
//  }
//  .cust-item-label {
//    color: #161616;
//  }
//  .ant-descriptions-submit {
//    margin: 24px;
//    padding-bottom: 24px;
//  }
//}
.global-box{
  position: relative;
}
/deep/input{
  border: none!important;
}
/deep/.ant-select-selection{
  border: none !important;
}
/deep/.ant-upload.ant-upload-drag{
  background: none !important;
  border: none !important;

}
.global-box{
  position: relative;
}
/deep/input{
  border: none!important;
}
/deep/.ant-select-selection{
  border: none !important;
}
/deep/.ant-upload.ant-upload-drag{
  background: none !important;
  border: none !important;
}
.img *{
  margin: 0!important;
  padding: 0!important;
}
/deep/.ant-upload-list-picture-card-container {
  float: left;
  width: 151px!important;
  height: 146px!important;
  margin: 0!important;
}
/deep/.ant-upload-list-picture-card .ant-upload-list-item {
  float: left;
  width: 150px!important;
  height: 197px!important;
  margin: 0 !important;
}
/deep/.ant-upload.ant-upload-select-picture-card{
  width: 150px!important;
  height: 197px!important;
  margin: 0 !important;
}
</style>
